@mixin absCenter {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@mixin flexColumnCenter {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

@mixin flexRowCenter {
  display: flex;
  justify-content: center;
  align-items: center;
}

@mixin flexAround {
  display: flex;
  align-items: center;
  justify-content: space-around;
}

@mixin flexBetween {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@mixin gridCenter {
  display: grid;
  align-items: center;
  justify-items: center;
}

@mixin pseudoIcon($position) {
  @if $position == 'before' or $position == 'after' {
    &::#{$position} {
      content: '';
      display: block;
      width: 3rem;
      height: 3rem;
      position: absolute;
      z-index: 1;
      white-space: nowrap;
    }
  }
}
